<template>
  <div class="my-participation-list">
    <v-alert v-if="supportAlert.alertShow" v-bind:type="supportAlert.type" v-on:listenToDialog="function(type){supportAlert.alertShow = false}"></v-alert>
    <v-no-data v-if="noItem" v-bind:errMessage="errMessage"></v-no-data>
    <ul v-if="!noItem">
      <li v-for="(item, index) in listData" v-bind:key="index" v-on:click="itemClick(index,item)">
        <v-list-item v-bind:item="item" v-bind:refrashCallback="refrashCallback"></v-list-item>
      </li>
    </ul>
  </div>
</template>

<script>
import item from './sub_vues/MyParticipationItem'
import noData from './sub_vues/NoParticipation'
import joinResultDialog from '../../components/join_result_dialog/JoinResultDialog'
import dropload from '../../../static/js/dropload/dropload.min.js'
const ERR_OK = 0;

function requestData(url, vueObject, callback) {
  vueObject.$http.get(url).then((response => {
    response = response.body
    if (response.errno == ERR_OK) {
      if (response.is_login == 0) {
        vueObject.noItem = true
        vueObject.listData = []
        vueObject.errMessage = '您还没登录呢~'
      } else {
        vueObject.listData = response.data;
        if (vueObject.listData.length > 0) {
          vueObject.noItem = false
        } else {
          vueObject.noItem = true
          vueObject.errMessage = '您还没参与任何活动'
        }
      }
    } else {
      vueObject.noItem = true
      vueObject.listData = []
      vueObject.errMessage = response.msg.length ? response.msg.length : '您还没参与任何活动'
    }

    if (callback && callback instanceof Function) {
      callback(true)
    }
  }), (response => {
    vueObject.noItem = true
    vueObject.listData = []
    vueObject.errMessage = '诶呀~网络错误了，刷新一下试试~'
    if (callback && callback instanceof Function) {
      callback(true)
    }
  }))
}

export default {
  components: {
    'v-list-item': item,
    'v-no-data': noData,
    'v-alert': joinResultDialog
  },
  methods: {
    itemClick: function(index, item) {
      this.supportAlert.alertShow = !this.utils.supportWccia()
      if (!this.supportAlert.alertShow) {
        this.utils.doRouter(this, '/detail', { 'jpid': item.jpid, 'h5title': '积分夺宝' })
      }
    },
    refrashCallback: function(type, id) {
      var url = this.wccconfig.buildUrl('/Jfproduct/myjoin') + this.utils.getUrlParams(location.href)
      requestData(url, this)
    }
  },
  data() {
    return {
      listData: [],
      errMessage: '您还没参与任何活动',
      noItem: false,
      supportAlert: {
        alertShow: false,
        type: '6'
      }
    }
  },
  created() {
    var vueThis = this
    var url = this.wccconfig.buildUrl('/Jfproduct/myjoin') + this.utils.getUrlParams(location.href)
    requestData(url, vueThis)
    //下拉刷新
    $(function() {
      //绑定到需要滑动的class上
      $('.my-participation-list').dropload({
        scrollArea: window,
        loadUpFn: function(me) {
          requestData(url, vueThis, function(isSuccess) {
            // 每次数据加载完，必须重置
            me.resetload();
          })
        }
      })
    })
  }
}
</script>

<style lang="stylus" >
@import '../../common/stylus/mixin.styl'
@import '../../../static/js/dropload/dropload.css'
.my-participation-list
  min-height : 12.70rem
</style>
